import base from "@src/store/base";
import { storeBindingsBehavior } from "mobx-miniprogram-bindings";
import dayjs from "dayjs";

Component({
  behaviors: [storeBindingsBehavior],
  storeBindings: [
    {
      store: base,
      // fields: ["themeColor", "themeTitleColor"],
    },
  ],
  properties: {
    step: {
      type: Number,
      value: 0,
    },
    min: {
      type: Number,
      value: 0,
    },
    max: {
      type: Number,
      value: 999,
    },
    disable: {
      type: Boolean,
      value: false,
    },
  },
  observers: {
    originValue: function (value) {
      const num = Number(value);
      const { min, max } = this.data;
      this.setData({
        minusDisabled: num <= min,
        plusDisabled: max && num >= max,
      });
    },
    step: function (value) {
      this.setData({
        originValue: Number(value),
      });
      this.triggerEvent("change", this.data.originValue);
    },
  },
  data: {
    originValue: 0,
    minusDisabled: false,
    plusDisabled: false,
    themeColor: "#ffb72f",
  },

  lifetimes: {
    ready: function () {
      this.setData({
        originValue: this.data.step,
      });
    },
  },
  methods: {
    handleInput(e) {
      const { step, min, max } = this.data;
      if (this.data.disable) {
        this.setData({
          originValue: this.data.step,
        });
        return;
      }
      const value = e?.detail?.value;
      const num = Number(value);
      if (num > step) {
        if (max && num < max) {
          this.setData({
            originValue: num,
          });
        } else if (max && num > max) {
          this.setData({
            originValue: max,
          });
        } else {
          this.setData({
            originValue: num,
          });
        }
        wx.nextTick(() => {
          this.triggerEvent("change", this.data.originValue);
          this.triggerEvent("plus", this.data.originValue);
        });
      }
      if (num < step) {
        if (num >= min) {
          this.setData({
            originValue: num,
          });
        }
        wx.nextTick(() => {
          this.triggerEvent("change", this.data.originValue);
          this.triggerEvent("minus", this.data.originValue);
        });
      }
    },
    handleMinus() {
      if (this.data.disable) {
        this.setData({
          originValue: this.data.step,
        });
        this.triggerEvent("minus", this.data.originValue);
        return;
      }
      const { originValue, min } = this.data;
      const num = Number(originValue) - 1;
      if (num >= min) {
        this.setData({
          originValue: num,
        });
      }
      wx.nextTick(() => {
        this.triggerEvent("change", this.data.originValue);
        this.triggerEvent("minus", this.data.originValue);
      });
    },
    handlePlus() {
      if (this.data.disable) {
        this.setData({
          originValue: this.data.step,
        });
        this.triggerEvent("plus", this.data.originValue);
        return;
      }
      const { originValue, max } = this.data;
      const num = Number(originValue) + 1;
      if (max && num < max) {
        this.setData({
          originValue: num,
        });
      } else if (max && num > max) {
        this.setData({
          originValue: max,
        });
      } else {
        this.setData({
          originValue: num,
        });
      }
      wx.nextTick(() => {
        this.triggerEvent("change", this.data.originValue);
        this.triggerEvent("plus", this.data.originValue);
      });
    },
  },
});
